html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0 none;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
html {
    color: #000000;
    background: #ffffff;
    overflow-y: scroll;
}
body {line-height: 1;}
h1, h2, h3, h4, h5, h6 {font-weight: normal;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption, th {text-align: left;}
*:focus {outline: none 0;}
input::-moz-focus-inner, a img,:link img,:visited img {border: 0 none;}
:link, :visited, :hover, :active {text-decoration: none;}
address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: normal;
}
textarea {overflow: auto;}


a{
    color: #339CA5;
}

/*		Default Layout: 992px.
        Gutters: 24px.
        Outer margins: 48px.
        Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

body {
    font-family: "Lucida Grande", Verdana, Tahoma, sans-serif;
    font-size: 14px;
    line-height: 15px;
    color: #444;
    padding: 48px 48px 84px;
    margin: 0 auto;
    width: 896px;
    -webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
}
    nav {
        background: #BEBBBB;
        letter-spacing: .5px;
        overflow:  auto;
        top: 0;
            -webkit-box-shadow: 0 3px 3px 0 #ccf;
            -moz-box-shadow: 0 3px 3px 0 #ccf;
            box-shadow: 0 2px 6px 0 #bbb;
    }
        nav a {
            display: block;
            color: #fff;
            float: left;
            padding: 10px 18px;
            border-right: 1px solid #eee;
        }
            nav .intro {
                background: #3a3a3a;
            }
            nav .cookbook {
                background: #339CA5;
            }
            nav .quickstart {
                background: #757575;
            }
            nav .javadoc {
                background: #757575;
            }
            nav .download {
                background: #929090;
            }
            nav .contrib {
                background: #a6a6a6;
                background-image:url('http://skyscreamer.org/i/blacktocat.png');
                background-repeat:no-repeat;
                background-position:center;
                background-origin:content-box;
            }
        nav a.active {
            background: #f3444e;
        }
    header { }
        header h1 {
            clear: both;
            color: #339CA5;
            font-size: 43px;
            line-height: 60px;
	    float: left;
	    width: 70%;
        }
        header h2 {
            padding: 33px 0 0 0;
            float: left;
            text-align: right;
            width: 30%;
        }
	header h2 a {
	    color: #950510;
        }
        header ul li {
            float: left;
        }
section {
    clear: both;
    margin: 0 0 20px 0;
    padding: 0 20px;
}
    section h2 {
        border-bottom:  2px solid #339CA5;
        font-size: 20px;
        line-height: 21px;
        margin-bottom: 20px;
        padding-top: 30px;
    }
    section p {
        margin: 10px 0;
    }
    section blockquote,
    section pre {
        background: #B2F1F7;
        border: 3px double #aaa;
        padding: 10px;
    }
    section pre {
        overflow: auto;
        font: 11px "Courier New", Courier, monospace;
    }
        section blockquote a {
            font: 12px "Courier New", Courier, monospace;
            color: #000;
        }
    section .demo {
        background: #d1d1ff;
        border: 3px double #aaa;
        float: left;
        margin: 20px 0 20px 0;
        padding: 8px;
        width: 380px;
    }
        section .demo h5 {
            font-size: 13px;
            font-weight: bold;
        }
            section .demo .wrapper {
                display: none;
                font: 12px "Courier New", Courier, monospace;
                margin: 0;
                padding: 0;
            }
                section .wrapper article h4 {
                    font-weight: bold;
                    margin-top: 20px;
                }
                section .demo .wrapper h4 {
                    font-size: 15px;
                }
                section .demo input,
                section .demo textarea {
                    border: 1px solid #888;
                    margin-top: 30px;
                    width: 100%;
                }
                section .demo textarea {
                    height: 150px;
                }
        section .demo2 {
            float: right;
        }
    section div.example {
        margin: 30px 20px;
    }
        section div.example p {
            font: 12px Verdana;
            margin-bottom: 3px;
        }
    section ul {
        list-style: circle;
        margin-left: 20px;
    }
        section ul li {
            margin-bottom: 8px;
        }

    .strikethrough { text-decoration: line-through; }

    .emphasize { font-weight: bold; }

    .perf_table {
        border: #30873E 2px solid;
        width: 800px;
    }

    .perf_table th {
        border: #30873E 1px solid;
        padding: 3px;
        spacing: 3px;
        background-color: #30873E;
        color: #FFFFFF;
    }

    .perf_table td {
        border: #30873E 1px solid;
        padding: 3px;
        spacing: 3px;
    }

    .perf_table .alt_row td {
        border: #30873E 1px solid;
        padding: 3px;
        spacing: 3px;
        background-color: #7EC16A;
    }



/*		Tablet Layout: 768px.
Gutters: 24px.
Outer margins: 28px.
Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {

    body {
        width: 712px;
        padding: 48px 28px 60px;
    }
    section .demo {
        width: 285px;
    }
}



/*		Mobile Layout: 320px.
        Gutters: 24px.
        Outer margins: 34px.
        Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {

    body {
        width: 252px;
        padding: 48px 34px 60px;
    }
        nav li a {
            float: none;
            display: block;
        }
        section .demo {
            float: left;
            width: 200px;
        }

}



/*		Wide Mobile Layout: 480px.
        Gutters: 24px.
        Outer margins: 22px.
        Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {

    body {
        width: 436px;
        padding: 48px 22px 48px;
    }
    section .demo {
        float: left;
    }

}
